<template>
    <view class="upgrade" :style=" { paddingTop: paddingHeight + 'px' } ">
        <nav-bar title="仪器升级"></nav-bar>
        <view class="main">
            <view class="c_tip">
                当前版本
            </view>
            <view class="content">
                Version {{ ble.versionInfo.FwVersion ? ble.versionInfo.FwVersion : '' }}
            </view>
        </view>
        <view class="status">
            <view class="checking" v-if="state == 'checking'">
                <u-loading-icon text="版本检测中..." textColor="#333333" size="18" textSize="14"></u-loading-icon>
            </view>
            <view class="fail" v-else-if="state == 'checkFail'">
                <u-image width="36rpx" height="36rpx" :showMenuByLongpress=" false "
                    src="http://oss.antaimedical.com/images/static/2024/08/66b08f27e4b09217821c0fa1C3vi4ZI1o60ke411a61ea58c163d2c0e55283941a3d0.png"
                    :lazy-load=" true "></u-image>
                <text style="padding-left: 16rpx;">版本检测失败</text>
            </view>
            <view class="fail" v-else-if="state == 'checkNewPor'">
                <!-- <u-image width="36rpx" height="36rpx" :showMenuByLongpress=" false "
                    src="http://oss.antaimedical.com/images/static/2024/08/66b08f27e4b09217821c0fa1C3vi4ZI1o60ke411a61ea58c163d2c0e55283941a3d0.png"
                    :lazy-load=" true "></u-image> -->
                <text style="padding-left: 16rpx;">已经是最新版本了</text>
            </view>
            <view class="hasNew" v-else-if="state == 'hasNewVersion'">
                <u-image width="36rpx" height="36rpx" :showMenuByLongpress=" false "
                    src="http://oss.antaimedical.com/images/static/2024/08/66b08f14e4b09217821c0fa0xkVm7ZyU1bdb3f3c0a2388194697f5edeb51acc34e44.png"
                    :lazy-load=" true "></u-image>
                <text style="padding-left: 8rpx;">有新版本可升级</text>
            </view>
            <view class="isNew" v-else-if="state == 'newest'">
                已是最新版本
            </view>
        </view>
        <view class="retry large_button" v-if="state == 'checkFail'" @click="$u.throttle(query, 2000)">
            重试
        </view>
        <view class="new" v-if="state == 'hasNewVersion'">
            <view class="version_list">
                <text class="left">固件</text>
                <view class="select" @click="showVersion = true">
                    <text>{{ currentIndex === undefined ? '请选择想要升级的固件' : versionList[currentIndex].firmwareVersion
                        }}</text>
                    <u-image width="16rpx" height="14rpx" :showMenuByLongpress=" false "
                        src="http://oss.antaimedical.com/images/static/2024/08/66b09854e4b000d2c606b51etKFL0Gsc4JMbbb41661e8b08cee88deb4f08f9264dfe.png"
                        :lazy-load=" true "></u-image>
                </view>

            </view>
            <!-- <view class="intro">
				升级内容升级内容升级内容升级内容升级内容升级内容升级内容升级内容升级内容升级内容升级内容
			</view> -->
        </view>
        <view class="large_button immediately" @click="$u.throttle(begin, 2000)" v-if="state == 'hasNewVersion'">
            立即升级
        </view>
        <view class="b_tips">
            <view class="l_1">
                请注意
            </view>
            <view class="l_2">
                请确保仪器电量50%以上并贴近手机
            </view>
            <view class="l_3">
                升级过程请勿离开此页面
            </view>
        </view>
        <u-popup :show=" show " mode="center" :safeAreaInsetBottom=" false " :closeOnClickOverlay=" false " round="10">
            <view class="progress_pop">
                <view class="top">
                    <view class="t-2">
                        <view class="title">
                            固件升级
                        </view>
                        <view class="progress" v-if="status == 1">
                            <u-line-progress height="11" activeColor="#545DDE" inactiveColor="#E5E5E5"
                                :percentage=" dwonloadPercentage "></u-line-progress>
                        </view>
                        <view class="progress" height="11"
                            v-else-if="status == 3 || status == 4 || status == 5 || status == 6 || status == 7 || status == 8">
                            <u-line-progress activeColor="#545DDE" inactiveColor="#E5E5E5"
                                :percentage=" upgradePercentage "></u-line-progress>
                        </view>
                        <view class="loading" v-else-if="status == 9">
                            <u-loading-icon size="32"></u-loading-icon>
                        </view>
                        <view class="status-text" :class=" { mt: status == 10 || status == 11 || status == 12 } ">
                            {{ status | statusFilte }}
                        </view>
                    </view>
                    <view class="handle">
                        
                        <view class="button" @click="$u.throttle(tryAgain, 1500)"
                            v-if="status == 2 || status == 4 || status == 7 || status == 8 || status == 10">
                            重试
                        </view>
                        <view class="button" @click="$u.throttle(back, 1500)"
                            v-if=" status == 11">
                            完成
                        </view>
                        <view class="button" v-else-if="ble.state == -1 && status != 9"
                            @click="$u.throttle(checkBleStatus, 2000)">
                            连接仪器
                        </view>
                        <view class="button border" @click="$u.throttle(stopUpgrade, 1500)"
                            v-if="status == 2 || status == 4 || status == 5 || status == 7">
                            停止升级
                        </view>
                        <view class="button border" @click="$u.throttle(closeBle, 1500)" v-else-if="status == 9">
                            停止连接
                        </view>
                    </view>
                </view>
                <view class="b_t">
                    请确保仪器电量50%以上并贴近手机
                    <br>
                    请保持手机不要息屏
                </view>
            </view>
        </u-popup>
        <u-popup :customStyle=" { width: '100%' } " :show=" showVersion " mode="bottom" :round=" 10 "
            @close="showVersion = false">
            <view class="pop">
                <picker-view mask-class="picker-mask" :immediate-change=" true " indicator-class="picker-indicator"
                    class="picker-view" :value=" value " @change=" changeVsIndex ">
                    <picker-view-column class="picker-column">
                        <view class="version" v-for="(vs, index) in versionList" :key=" vs.id ">
                            <text style="margin-right: 100rpx;font-size: 32rpx; color: 7f7f7f;">v{{ vs.firmwareVersion
                                }}</text>
                            <text style="font-size: 32rpx;">{{ Math.ceil(vs.imageSize / 1024) }}KB</text>
                        </view>
                    </picker-view-column>
                </picker-view>
                <view class="confirm" @click=" confirm ">
                    确定
                </view>
            </view>

        </u-popup>
    </view>
</template>

<script>
import {
    findUpgradeMsg,
    findFirmwareList
} from '@/api/index.js'
import {
    ab2hex,
    hex2int
} from '@/utils/utils.js'
import {
    ooo9,
    oooa,
    oooc,
    ooof,
} from '@/api/bleApi.js'
import {
    mapState
} from 'vuex'
const BLE = require('@/utils/ble.js');
export default {
    data () {
        return {
            paddingHeight: uni.getStorageSync('navbarHeight'),
            status: 0,
            state: 'checking',
            system: '',
            dwonloadPercentage: 0, // 下载进度
            upgradePercentage: 0, // 升级进度
            show: false,
            showVersion: false,
            progress: undefined,
            defaultDev: {},
            versionList: [],
            value: [0], // 当前选择版本下标
            currentIndex: undefined,
            packetLen: 128, // 固定数据包长度
            upgradeArr: [], // 原生数据转换成十六进制后的
            splitSendInfo: [], // 切割好的总数据
            currentSendIndex: 0,
            errNum: 0, // 发送失败次数
            type: 'currentIndex',
            preIndex: undefined, // 上一次未完成升级发送的数据下标
            preVersion: '', // 上一次未完成升级的版本
            levelingUp: false,
            isUpgrades:false
        }
    },
    filters: {
        statusFilte (data) {
            if (data == 1) {
                return '下载中...'
            } else if (data == 2) {
                return '下载失败'
            } else if (data == 3) {
                return '发送中...'
            } else if (data == 4) {
                return '发送失败,建议重试'
            } else if (data == 5) {
                return '蓝牙断开连接'
            } else if (data == 6) {
                return '蓝牙连接中...'
            } else if (data == 7) {
                return '未找到仪器，请保证仪器和手机处于蓝牙开启状态'
            } else if (data == 8) {
                return '连接成功'
            } else if (data == 9) {
                return '发送成功,请等待仪器重启重连'
                // return '发送成功,请重启仪器重连蓝牙'
            } else if (data == 10) {
                return '连接超时,请重试'
            } else if (data == 11) {
                // return '升级成功,仪器已重连'
                return '升级成功,请手动启动仪器'
            } else if (data == 12) {
                return '升级失败'
            } else {
                return ''
            }
        }
    },
    computed: {
        ...mapState({
            ble: state => state.ble,
            versionInfo: state => state.versionInfo,
            defaultInfo: state => state.defaultInfo,
        })
    },
    watch: {
        'ble.state': {
            handler (nVal, oVal) {
                console.log('nVal', nVal)
                console.log('oVal', oVal)
                if (nVal == 0) { // 断开连接场景
                    if (this.status != 9 && this.status != 10) { // 不是发送成功状态断开
                        this.status = 8
                    }
                    if(this.isUpgrades ){
                        this.status = 11
                    }
                } else if (nVal == -1) { // 断开连接场景
                    if (this.status != 9 && !this.isUpgrades) { // 不是发送成功状态断开
                        this.status = 5
                    }
                } else if (nVal == -2 || nVal == -3) { // 连接中
                    if (this.status != 9 && !this.isUpgrades) { // 不是发送成功状态断开
                        this.status = 6
                    }
                } else if (nVal == -5 || nVal == -4) { // 连接超时或连接失败
                    if(!this.isUpgrades){
                        if (this.status == 9) {
                            this.status = 10
                        } else {
                            this.status = 7
                        }
                    }
                }
            }
        },
    },
    onLoad (OPTIONS) {
        this.system = uni.$u.os()
			if (OPTIONS.index) {
				this.type = 'preIndex'
				this.preIndex = Number(OPTIONS.index)
				this.preVersion = OPTIONS.version
				console.log('this.preIndex', this.preIndex);
				console.log('this.preVersion', this.preVersion);
			}
			if (OPTIONS.deviceInfo) {
				this.defaultDev = JSON.parse(OPTIONS.deviceInfo)
			}
    },
    onUnload () {
        this.levelingUp = false
    },
    onReady () {
        this.query()
    },
    methods: {
        // 像仪器发送查询终端属性指令
        query () {
            this.state = 'checking'
            this.fetchVersionList()
        },
        // 查询固件数据
        async fetchVersionList () {
            let params = {
                firmwareId: String(this.ble.versionInfo.FwId),
                firmwareVersion: this.ble.versionInfo.FwVersion
            }
            try {
                const res = await findFirmwareList(params)
                if(!res.data){
                    this.state = 'checkFail'
                    return
                }
                await ooof({ type: '000f' }).then((res) => {
                    if (res.data[0] == 1) {
                        this.preVersion = res.data[1]
                        this.preIndex = res.data[2]
                        this.type = 'preIndex'
                    }
                })
                if (res.code == 200 && res.data.length) {
                    this.versionList = res.data
                    this.state = 'hasNewVersion'
                    if (this.type == 'preIndex') {
                        this.currentIndex = this.versionList.findIndex((item, index) => {
                            return item.firmwareVersion == this.preVersion
                        })
                        if(this.currentIndex != -1) {
                            //  继续上一次未完成的升级进度
                            this.connectPre()
                        }
                    }
                } else {
                    console.log(res)
                    this.state = 'checkNewPor'
                }
            } catch (e) {
                this.state = 'checkFail'
                //TODO handle the exception
            }
        },

        // 检查是否能更新
        async checkUpgrade () {
            let params = {
                firmwareId: String(this.ble.versionInfo.FwId),
                firmwareVersion: this.ble.versionInfo.FwVersion
            }
            try {
                const res = await findUpgradeMsg(params)
                if (res.code == 200 && res.data == 1) {
                    this.show = true
                    this.status = 1
                    // 开始下载
                    const downloadTask = uni.downloadFile({
                        url: this.versionList[this.currentIndex].firmwareUrl,
                        filePath: `${wx.env.USER_DATA_PATH}/upgrade`,
                        success: (downloadFileRes) => {
                            console.log(downloadFileRes);
                            var pathArrayBuffer = wx.getFileSystemManager().readFileSync(
                                downloadFileRes.filePath);
                            this.upgradeArr = this.splitEveryTwo(ab2hex(pathArrayBuffer))
                            this.splitSendInfo = this.getNewArray(this.upgradeArr, this
                                .packetLen)
                            this.handleCheckVersion()
                        },
                        fail: err => {
                            console.log('downloadTask', err)
                            this.status = 2
                        }
                    });

                    downloadTask.onProgressUpdate((res) => {
                        this.dwonloadPercentage = res.progress
                        console.log('下载进度' + res.progress);
                        console.log('已经下载的数据长度' + res.totalBytesWritten);
                        console.log('预期需要下载的数据总长度' + res.totalBytesExpectedToWrite);

                        // 测试条件，取消上传任务。
                        if (res.progress >= 100) {
                            downloadTask.offProgressUpdate();
                        }
                    });
                }
            } catch (e) {
                //TODO handle the exception
                console.log(e)
            }
        },
        connectPre () {
            this.show = true
            this.status = 1
            // 开始下载
            const downloadTask = uni.downloadFile({
                url: this.versionList[this.currentIndex].firmwareUrl,
                filePath: `${wx.env.USER_DATA_PATH}/upgrade`,
                success: (downloadFileRes) => {
                    console.log(downloadFileRes);
                    var pathArrayBuffer = wx.getFileSystemManager().readFileSync(
                        downloadFileRes.filePath);
                    this.upgradeArr = this.splitEveryTwo(ab2hex(pathArrayBuffer))
                    this.splitSendInfo = this.getNewArray(this.upgradeArr, this
                        .packetLen)
                    this.handleCheckVersion()
                },
                fail: err => {
                    console.log('downloadTask', err)
                    this.status = 2
                }
            });

            downloadTask.onProgressUpdate((res) => {
                this.dwonloadPercentage = res.progress
                console.log('下载进度' + res.progress);
                console.log('已经下载的数据长度' + res.totalBytesWritten);
                console.log('预期需要下载的数据总长度' + res.totalBytesExpectedToWrite);

                // 测试条件，取消上传任务。
                if (res.progress >= 100) {
                    downloadTask.offProgressUpdate();
                }
            });
        },
        //开始下载并升级
        begin () {
            if (this.currentIndex === undefined) {
                uni.showToast({
                    icon: 'none',
                    title: '请先选择要更新的版本'
                })
                return
            }
            this.checkUpgrade()
        },
        handleCheckVersion () {
            ooof({ type: '000f' }).then((res) => {
                if (res.data[0] == 1) {
                    this.preVersion = res.data[1]
                    this.preIndex = res.data[2]
                    this.type = 'preIndex'
                }
                let params = {
                    type: '0009',
                    FwId: '0',
                    "HwVersion": this.versionList[this.currentIndex].hardwareVersion,
                    "FwVersion": this.versionList[this.currentIndex].firmwareVersion,
                    "ImageSize": Number(this.versionList[this.currentIndex].imageSize),
                    "ImageCRC": this.versionList[this.currentIndex].imageCrc,
                }
                ooo9(params).then((res) => {
                    if (res.data[0] == 1) {
                        this.levelingUp = true
                        this.status = 3
                        this.currentSendIndex = parseInt(res.data[1])
                        if (this.preVersion != params.FwVersion) {
                            this.currentSendIndex = 1
                        }
                        if(this.currentSendIndex == 0){
                            this.currentSendIndex = 1
                        }
                        this.handleSend(true)
                    }
                })
            })
        },
        handleSend (type) {
            // type判断是否是首次发送
            if (this.currentSendIndex >= this.splitSendInfo.length) {
                oooc().then((res) => {
                    if (res.data[0] == 0) {
                        this.status = 11
                        this.isUpgrades = true
                        // 升级完成
                        this.tryEndConnect()
                    } else {
                        // 升级失败
                        this.status = 12
                    }
                })
            }
            if (this.currentSendIndex < this.splitSendInfo.length) {
                this.currentSendIndex = type ? this.currentSendIndex : this.currentSendIndex + 1
                let parData = {
                    runCode: this.currentSendIndex,
                    lengthCode: this.splitSendInfo[this.currentSendIndex - 1].length,
                    contentCode: this.splitSendInfo[this.currentSendIndex - 1].join(''),
                }
                oooa(parData).then((res) => {
                    if (res.data[0] == 1 && this.levelingUp) {
                        this.status = 3
                        let total = (this.currentSendIndex / this.splitSendInfo.length).toFixed(2)
                        this.upgradePercentage = parseInt((Number(total) * 100).toFixed())
                        this.handleSend()
                    }
                    else if (this.errNum >= 5) {
                        this.status = 4
                    }
                    else {
                        this.errNum += 1
                    }
                })
            }
        },
        // 发送完毕后的尝试连接
        tryEndConnect () {
            console.log('tryEndConnect')
            this.type == 'currentIndex'
            BLE.common.myStartBluetoothDevicesDiscovery(30000, this.defaultDev)
            this.$store.commit('setBleConnectedName', this.defaultDev.bluetoothName)
        },
        tryAgain () {
            if (this.status == 2) {
                this.checkUpgrade()
            } else if (this.status == 4) {
                this.errNum = 0
                this.againSend()
            } else if (this.status == 7) {
                this.connectDev()
            } else if (this.status == 8) {
                this.errNum = 0
                this.againSend()
            } else if (this.status == 10) {
                this.tryEndConnect()
            }
        },
        // 停止升级
        stopUpgrade () {
            console.log('停止升级');
            if (this.status == 4) {
                this.levelingUp = false
                uni.navigateBack()
            } else {
                this.show = false
                this.levelingUp = false
                uni.navigateBack()
            }
        },
        // 按照之前的进度重新发送
        againSend () {
            this.handleCheckVersion()
        },
        changeVsIndex (e) {
            this.value = e.detail.value
        },
        confirm () {
            this.currentIndex = this.value
            this.showVersion = false
        },
        //  关闭蓝牙模块
        closeBle () {
            wx.stopBluetoothDevicesDiscovery()
            wx.closeBluetoothAdapter()
            this.$store.commit('changeIsOpenBleAdapter', false)
            uni.navigateBack()
        },
        // 连接仪器
        connectDev () {
            if (this.status == 6) return
            this.status = 6
            if (uni.$u.os() == 'android') { // 安卓系统直接连接
                console.log(this.defaultDev.deviceMac);
                this.$store.commit('setDefaultInfo', {
                    type: 1,
                    data: {
                        mac: this.defaultDev.deviceMac,
                        name: this.defaultDev.bluetoothName
                    }
                })
                BLE.common.createBLEConnectionFn(this.defaultDev.deviceMac, this.defaultDev)
            } else { // 苹果系统需要搜索uuid仪器id
                BLE.common.myStartBluetoothDevicesDiscovery(20000, this.defaultDev)
            }
            this.$store.commit('setBleConnectedName', this.defaultDev.bluetoothName)
        },
        checkBleStatus () {
            let that = this
            if (this.ble.isOpenBleAdapter) {
                wx.getBluetoothAdapterState({
                    success: res => {
                        if (!res.available) {
                            uni.showModal({
                                title: '提示',
                                content: '检测到手机蓝牙未打开,请前往手机[设置]-[蓝牙]打开蓝牙功能以扫描附近仪器',
                                showCancel: false,
                                confirmColor: '#545DDE'
                            })
                        } else {
                            that.connectDev()
                        }
                    },
                    fail: err => {
                        uni.showModal({
                            title: '提示',
                            content: '蓝牙功能异常，请重新进入小程序',
                            showCancel: false
                        })
                    }
                })
            } else {
                wx.closeBluetoothAdapter()
                wx.openBluetoothAdapter({
                    success (BleObj) {
                        that.$store.commit('changeIsOpenBleAdapter', true)
                        that.connectDev()
                    },
                    fail (err) {
                        console.log('openBluetoothAdapter', err)
                        if (err.errCode == 10001) {
                            that.$store.commit('changeIsOpenBleAdapter', true)
                            uni.showModal({
                                title: '提示',
                                content: '检测到手机蓝牙未打开,请前往手机[设置]-[蓝牙]打开蓝牙功能以扫描附近仪器',
                                showCancel: false,
                                confirmColor: '#545DDE'
                            })
                        }
                        if (err.errMsg == 'openBluetoothAdapter:fail auth deny') {
                            uni.showModal({
                                title: '提示',
                                content: '请先授权蓝牙权限',
                                confirmColor: '#545DDE',
                                success (modal_res) {
                                    if (modal_res.confirm) {
                                        wx.openSetting({
                                            success: (authData) => {
                                                if (authData.authSetting[
                                                    'scope.bluetooth']) {
                                                    that.checkBleStatus()
                                                } else { // 未授权
                                                    uni.showModal({
                                                        title: '提示',
                                                        content: '授权失败,您将无法使用蓝牙相关服务',
                                                        confirmColor: '#545DDE',
                                                        showCancel: false,
                                                        success (modal) {
                                                            if (modal
                                                                .confirm) {
                                                                wx.closeBluetoothAdapter()
                                                                that.$store.commit(
                                                                    'changeIsOpenBleAdapter',
                                                                    false)
                                                            }
                                                        }
                                                    })

                                                }
                                            }
                                        })
                                    } else {
                                        uni.showModal({
                                            title: '提示',
                                            content: '授权失败,您将无法使用蓝牙相关服务',
                                            confirmColor: '#545DDE',
                                            showCancel: false,
                                            success (modal) {
                                                if (modal.confirm) {
                                                    wx.closeBluetoothAdapter()
                                                    that.$store.commit(
                                                        'changeIsOpenBleAdapter',
                                                        false)
                                                }
                                            }
                                        })
                                    }
                                }
                            })
                        }
                    }
                })
            }
        },
        back () {
            uni.navigateBack()
        },
        getNewArray (array, subGroupLength) {
            let index = 0;
            let newArray = [];
            while (index < array.length) {
                newArray.push(array.slice(index, (index += subGroupLength)));
            }
            return newArray;
        },
        splitEveryTwo (str) {
            return str.split('').filter(function (value, index) {
                return index % 2 === 0;
            }).map(function (char, index) {
                return str.substr(index * 2, 2);
            });
        },
        stringToHex (str) {
            var result = '';
            for (var i = 0; i < str.length; i++) {
                result += str.charCodeAt(i).toString(16);
            }
            return result;
        }
    },
}
</script>

<style lang="scss">
.u-popup__content {
    width: 80%;
}
</style>
<style lang="scss" scoped>
.upgrade {
    display: flex;
    flex-direction: column;
    justify-content: center;

    .main {
        width: 100%;
        padding-top: 140rpx;
        display: flex;
        flex-direction: column;
        justify-content: center;
        color: #333;

        .c_tip {
            font-size: 42rpx;
            font-weight: 500;
            padding-bottom: 8rpx;
            font-family: PingFangSC-Medium, PingFang SC;
        }

        .content {
            font-size: 28rpx;
        }
    }

    .status {
        margin-top: 86rpx;
        font-size: 28rpx;
        display: flex;
        flex-direction: column;
        align-items: center;

        .checking {
            width: 100%;
            display: flex;
            justify-content: center;
        }

        .hasNew,
        .fail {
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }

    .retry {
        position: fixed;
        bottom: 300rpx;
        left: 50%;
        transform: translateX(-50%);
    }

    .new {
        margin: 80rpx 48rpx 48rpx;
        padding: 32rpx;
        background-color: #FAFAFA;
        border-radius: 32rpx;

        .version_list {
            height: 104rpx;
            padding: 24rpx 48rpx;
            display: flex;
            align-items: center;
            background-color: #fff;
            border-radius: 16rpx;
            font-size: 32rpx;

            .left {
                font-size: 32rpx;
                color: #333333;
                padding-right: 16rpx;
            }

            .select {
                flex: 1;
                height: 56rpx;
                border: 2rpx solid #666;
                display: flex;
                align-items: center;
                justify-content: space-between;
                border-radius: 16rpx;
                font-size: 28rpx;
                color: #666666;
                padding: 0 30rpx 0 16rpx;
            }
        }

        .intro {
            background-color: #fff;
            border-radius: 16rpx;
            padding: 24rpx;
            line-height: 34rpx;
            margin-top: 16rpx;
            height: 180rpx;
            font-size: 24rpx;
            text-align: left;
        }
    }

    .immediately {
        margin: 0 auto;
    }

    .b_tips {
        position: fixed;
        bottom: 48rpx;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        text-align: center;
        color: #333;

        .l_1 {
            font-size: 32rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
        }

        .l_2 {
            font-size: 28rpx;
            margin: 16rpx 0 64rpx;
        }

        .l_3 {
            font-size: 24rpx;
        }
    }

    .progress_pop {
        width: 100%;
        height: 760rpx;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;

        .top {
            flex: 1;
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;

            .t-2 {
                width: 100%;
            }
        }

        .title {
            padding: 64rpx 0 0;
            font-weight: 500;
            font-size: 34rpx;
            color: #353535;
            font-family: PingFangSC-Medium, PingFang SC;
        }

        .loading {
            margin: 60rpx auto;
        }

        .progress {
            width: 100%;
            padding: 122rpx 140rpx 32rpx;
        }

        .status-text {
            font-size: 32rpx;
            color: #353535;
        }

        .mt {
            padding-top: 112rpx;
        }

        .handle {
            width: 100%;
            padding: 0 24rpx;

            .button {
                width: 100%;
                height: 88rpx;
                line-height: 88rpx;
                background-color: #545dde;
                color: #fff;
                font-size: 32rpx;
                border-radius: 16rpx;
                font-weight: 500;
            }

            .border {
                line-height: 80rpx;
                color: #545dde;
                margin-top: 22rpx;
                background-color: #fff;
                border: 4rpx solid #545dde;
            }

        }

        .b_t {
            font-size: 24rpx;
            color: #333333;
            padding: 48rpx 0;
            letter-spacing: 1rpx;
        }
    }

    .pop {
        width: 100%;
        padding: 40rpx 56rpx 68rpx;

        .confirm {
            width: 80%;
            height: 80rpx;
            margin: 0 auto;
            color: #fff;
            background-color: #545DDE;
            line-height: 80rpx;
            text-align: center;
            border-radius: 40rpx;
        }
    }

    /deep/ .picker-indicator {
        height: 100rpx;
        background-color: rgba(255, 255, 255, 0);
        z-index: 0;
    }

    .picker-view {
        width: 100%;
        height: 550rpx;

        .version {
            width: 100%;
            height: 100rpx !important;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 30rpx 50rpx;
        }
    }

    .picker-mask {
        background-image: linear-gradient(#ffffff, rgba(255, 255, 255, 0.13)), linear-gradient(rgba(255, 255, 255, 0.123), #ffffff);
    }
}
</style>